main{
    width: 1170px;
    margin: 0 auto;
    margin-top: 20px;
    // 主页左边
    #main-left{
        float: left;
        width: 110px;
        height: 470px;
        #lefts{
            li{
                width: 94px;
                height: 40px;
                font-size: 18px;
                text-align: center;
                line-height: 40px;
                padding: 3px 4px;
                // background: rosybrown;
            }
            #remen{
                background: crimson;
                color: darkgray;
                border: 1px solid #eee;
                border-radius: 5px;
            }
            .show{
                background: crimson;
                color: darkgray;
                border: 1px solid #eee;
                border-radius: 5px;
            }
        }
        
    }
    // 主页中间部分
    #main-conter{
        float: left;
        margin-left: 28px;
        width: 660px;
        #carousels{
            position: relative;
            margin-top: 20px;
            margin-top: 0px;
            #carousel{
                .img1{
                    width: 500px;
                    height: 300px;
                    margin-left: 15px;
                    background: bisque;
                }
                .img2{
                    width: 140px;
                    height: 145px;
                    position: absolute;
                    top: 0;
                    right: -5px;
                    background: cadetblue;
                
                }
                .img3{
                    width: 140px;
                    height: 145px;
                    position: absolute;
                    bottom: 0;
                    right: -5px;
                    background: cornflowerblue;
                }
                .content1{
                    position: absolute;
                    z-index: 10;
                    top: 230px;
                    left: 30px;
                    font-size: 20px;
                    font-weight: 700;
                    color: #eee;
                }
                .content1_item{
                    position: absolute;
                    z-index: 10;
                    top: 265px;
                    left: 30px;
                    font-size: 14px;
                    color: #eee;
                }
                .content2_item{
                    position: absolute;
                    z-index: 10;
                    top: 265px;
                    left: 130px;
                    font-size: 13px;
                    color: #eee;
                }
                .content2{
                    position: absolute;
                    z-index: 10;
                    top: 85px;
                    color: #eee;
                    font-size: 16px;
                    left: 530px;
                }
                .content3{
                    position: absolute;
                    z-index: 10;
                    top: 240px;
                    color: #eee;
                    font-size: 16px;
                    left: 530px;
                }
            }
        }

        .weidu{
            width: 640px;
            height: 36px;
            line-height: 36px;
            margin-bottom: 20px;
            margin-left: 18px;
            margin-top: 5px;
            background: #fffdec;
            color: #ed7350;
            font-size: 14px;
            text-align: center;
            span{
                float: right;
                margin-right: 10px;
            } 
        }

        // 文章
        #articles{
            margin-left: 10px;
            .article{
                display: flex;
                padding: 20px 0;
                border-top:1px solid rgba(0,0,0,.05);
                img{
                  width: 200px;
                  height: 140px;
                }
                .text{
                    flex: 1;
                    margin-left: 10px;
                    p{
                        height: 90px;
                    }
                    .info{
                        height: 30px;
                        line-height: 30px;
                        display: flex;
                        position: relative;
                        span{
                        margin-right: 10px;
                        }
                        img{
                        width: 30px;
                        height: 30px;
                        border-radius: 50%;
                        margin-right: 10px;
                        }
                        .praise{
                            position: absolute;
                            right: 0;
                            display: flex;
                            span{
                                display: block;
                                color:#808080;
                                font-size: 16px;
                                margin:0 5px;
                                height: 30px;
                            }
                            em{
                                font-size: 18px;
                                position: relative;
                                margin-right: 3px;
                                top:4px;
                            }
                            em:hover{
                                color: #eb7350;
                            }
        
                        }
                    }
                }
            }
        }
    }



    // 主页右侧
    #main-right{
        float: right;
        width: 340px;
        height: 1352px;
        padding-top: 20px;
        background: #f2f2f5;
        #dlzc{
            width: 300px;
            height: 290px;
            margin: 0 auto;
            background: #fff;
            // position: relative;
            // 登录标题
            #dlzc-title{
                width: 270px;
                height: 40px;
                padding-top: 10px;
                margin: 0 auto;
                padding-left: 0px;
                border-bottom: 1px solid #ddd;
                position: relative;
                // background-color:slateblue;
                li{
                    display: inline;
                    width: 135px;
                    height: 30px;
                    font-size: 16px;
                    font-weight: 700;
                    margin-left: 40px;
                    margin-right: 20px;
                }
                #change{
                    background: url(../image/sprite_login.png) no-repeat;
                    background-position: 0px -150px;
                    width: 40px;
                    height: 40px;
                    // border: 1px solid red;
                    z-index: 2;
                    position: absolute;
                    top: 0px;
                    right: -35px;
                }
                #change1{
                    display: none;
                    background: url(../image/sprite_login.png) no-repeat;
                    background-position: -40px -191px;
                    width: 40px;
                    height: 40px;
                    // border: 1px solid red;
                    z-index: 2;
                    position: absolute;
                    top: 0px;
                    right: -35px;
                }
            }
            // 登录页面
            #dl{
                width: 270px;
                height: 280px;
                padding-left: 15px;
                // 账号登录
                #dlzc-zhdl{
                    // display: none;
                    width: 270px;
                    height: 191px;
                    // padding-left: 15px;
                    p:nth-child(1),p:nth-child(2){
                        width: 268px;
                        height: 28px;
                        margin-top: 15px;
                        margin-bottom: 10px;
                        border: 1px solid #eee;
                        span{
                            margin-left: 5px;
                            margin-right: 5px;
                        }
                        input{
                            width: 230px;
                            height: 26px;
                            border: none;
                            outline:medium;
                        }
                    }
                    p:nth-child(3){
                        font-size: 13px;
                        width: 268px;
                        margin-bottom: 10px;
                        span:nth-child(3){
                            float: right;
                        }
                    }
                    button{
                        width: 268px;
                        height: 32px;
                        background: #eb7350;
                        margin-bottom: 10px;
                        border: none;
                    }
                    p:nth-child(5){
                        width: 268px;
                        margin-bottom: 10px;
                        font-size: 13px;
                        a span{
                            color: #eb7350;
                        }
                    }

                }
                // 安全登录
                #dlzc-aqdl{
                    display: none;
                    width: 270px;
                    // margin-left: 15px;
                    margin-top: 15px;
                    // background:brown;
                    text-align: center;
                    position: relative;
                    #aqdl-conter{
                        margin: 0 auto;
                        text-align: center;
                        padding-top: 10px;
                        width: 174px;
                        height: 174px;
                        border: 1px solid #eee;
                        img{
                            
                            width: 150px;
                            height: 150px;
                        }
                        p{
                            font-size: 13px;
                        }
                    }
                    p{
                        margin: 0 auto;
                        font-size: 13px;
                        a span{
                            color: #eb7350;
                        }
                    }
                    #saoma{
                        width: 264px;
                        height: 372px;
                        background: url(../image/sprite_login.png) no-repeat -290px -150px;
                        position: absolute;
                        top: -80px;
                        left: -250px;
                        z-index: 3;
                    }
                }
                // 手机登录
                #dlzc-sjdl{
                    display: none;
                    width: 270px;
                    height: 191px;
                    padding-left: 15px;
                    margin-left: 8px;
                    // background: slateblue;
                    p:nth-child(1){
                        width: 240px;
                        height: 28px;
                        margin-top: 15px;
                        margin-bottom: 10px;
                        border: 1px solid #eee;
                        span{
                            margin-left: 5px;
                            margin-right: 5px;
                        }
                        input{
                            width: 200px;
                            height: 26px;
                            border: none;
                            outline:medium;
                        }
                    }
                    p:nth-child(2){
                        width: 268px;
                        height: 28px;
                        margin-top: 15px;
                        margin-bottom: 10px;
                        button{
                            width: 121px;
                            height: 32px;
                            font-size: 13px;
                            padding-left: 10px;
                            padding-right: 10px;
                            background: #f2f2f5;
                            border: 1px solid #ccc;
                            border: none;
                        }
                        input{
                            // float: right;
                            width: 114px;
                            height: 28px;
                            // padding-left: 10px;
                            border: none;
                            border: 1px solid #ccc;
                            outline:medium;

                        }
                    }
                    p:nth-child(3){
                        font-size: 13px;
                        width: 268px;
                        margin-bottom: 10px;
                        span:nth-child(3){
                            float: right;
                        }
                    }
                    button{
                        width: 268px;
                        height: 32px;
                        background: #eb7350;
                        margin-bottom: 10px;
                        border: none;
                    }
                    p:nth-child(5){
                        width: 268px;
                        margin-bottom: 10px;
                        font-size: 13px;
                        a span{
                            color: #eb7350;
                        }
                    }
                }
                // 成功登录
                #cgdl{
                    display: none;
                    position: relative;
                    width: 270px;
                    height: 191px;
                    // padding-left: 15px;
                    margin-left: 8px;
                    // background: sandybrown;
                    img{
                        margin-top: 10px;
                    }
                    #grtx{
                        position: absolute;
                        top: 40px;
                        left: 100px;
                        width: 60px;
                        height: 60px;
                        margin: 0 auto;
                        a img{
                            width: 60px;
                            height: 60px;
                            border-radius: 50%;
                        }
                    }
                    #nicheng{
                        a p{
                            text-align: center;
                            margin-top: 20px;
                            font-size: 14px;
                        }
                        ul{
                            margin: 0 auto;
                            width: 240px;
                            height: 65px;
                            padding: 16px 10px 9px 10px;
                        }
                        ul li{
                            margin: 0 auto;
                            text-align: center;
                            float: left;
                            width: 65px;
                            height: 45px;
                            p:first-child{
                                font-size: 18px;
                                margin-bottom: 5px;
                                width: 65px;
                                height: 18px;
                            }
                            p:nth-child(2){
                                font-size: 12px;
                            }
                        }
                    }
                }
            }
            
        }
    }
}
